<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        div {
            text-align: center;
            margin: 10px auto;
            line-height: 100px;
        }

        .num {
            width: 80px;
        }
    </style>
    <script>
        function add() {
            let a = document.getElementById("num1").value
            let b = document.getElementById("num2").value
            document.getElementById("result").value = parseFloat(a) + parseFloat(b)
        }
    </script>
</head>
<body>
<div>
    <input class="num" type="text" id="num1">
    +
    <input class="num" type="text" id="num2">
    =
    <input class="num" type="text" id="result">
    <input type="submit" value="加法" onclick="add()">
</div>


</body>
</html>